<template>
  <view class="header">
    <view v-if="showBackIcon" class="back-icon" @click="handleBackClick">
      返回
    <view>
    <view>{{title}}<view>
  <view>
</template>

<script>
export default {
  name: 'Header',
  props: {
    title: { // 标题
      type: String,
      default: ''
    },
    showBackIcon: { // 是否显示返回按钮
      type: Boolean,
      default: true
    }
  },
  methods: {
    handleBackClick () { // 处理返回按钮点击事件
      uni.navigateBack()
    }
  }
}
</script>

<style>
.header {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 44px;
}

.back-icon {
  position: absolute;
  left: 10px;
  color: #007aff;
}
<style>
